:root { --color-rgba: 212, 34, 32; --color-sub-rgba: 242, 108, 23; --color-hex: #d42220; --color-sub-hex: #f26c17 }
html { font-size: 16px; }
/*.textshadowwhite { text-shadow: 1PX -1px #fff,-1px 1px #999,-10px 10px 10px #808080; }*/
@media screen and (max-width:1024px) {
    html { font-size: 14px; }
}

body { font-weight: normal; /*text-rendering: optimizeLegibility;*/ color: #333; background-color: #fff; overflow-x: hidden; }
p { margin: 0; }
.bg-hover { background: #12498f; color: #fff; }
    .bg-hover:hover { border-color: #12498f; background: none; color: #12498f }

.container { width: 96%; max-width: 1320px; margin: 0 auto; padding: 0; }
.w1520 { width: 96%; max-width: 1620px; margin: 0 auto; }

@media (min-width: 1300px) {
    .container { width: 94%; max-width: 1620px; margin: 0 auto; padding: 0; }
    .w1520 { width: 94%; max-width: 1620px; margin: 0 auto; }
}

.container .container { padding: 0; width: 100%; }
.w1800 { width: 94%; max-width: 1800px; margin: 0 auto; }
.ovh { overflow: hidden; }
.clearfix, ul { zoom: 1; }
    .clearfix:after, ul:after { display: block; height: 0; clear: both; visibility: hidden; overflow: hidden; content: "."; }
img { max-width: 100%; }
ul, li { padding: 0; margin: 0; list-style: none; }
.fl { float: left; }
.fr { float: right; }
a { color: #333; text-decoration: none; }
    a:hover, a:active, a:focus { text-decoration: none; color: var(--color-hex); }
.db { display: block; }
.i-ell { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 100%; }
.i-ell-2 { max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.i-ell-3 { max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.i-ell-4 { max-width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }

.vertical_img { display: block; width: 100%; position: relative; overflow: hidden; background: #fff; cursor: pointer; }
    .vertical_img img.bgimg { width: 100%; }
    .vertical_img img.up-pic { transform: translateZ(0px); transition: transform 0.8s ease 0s; position: absolute; left: 0; top: 50%; width: 100%; z-index: 2; transform: translateY(-50%); }

.lazyloadimg { position: relative; overflow: hidden; cursor: pointer; margin: 0; padding: 0; }
    .lazyloadimg img.bgimg { width: 100%; }
    .lazyloadimg img.img { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 100%; z-index: 2; transition: all .8s; }
    .lazyloadimg.transform { }


@media (min-width: 767px) {
    .vertical_img:hover img.up-pic, .lazyloadimg:hover img.img { transform: scale(1.05, 1.05) translateY(-48%); transition: all .8s; }
}


.swiper-btn { display: flex; height: 40px; align-items: center; }
    .swiper-btn .i-pagination { bottom: initial; left: initial; }

@media screen and (max-width: 640px) {
    .swiper-btn { height: 32px; }
}

.swiper-btn .swiper-button-next,
.swiper-btn .swiper-button-prev { width: 40px; height: 40px; background-color: var(--color-hex); background-repeat: no-repeat; background-position: center center; background-size: 35%; position: static; transition: all 0.36s; margin-top: 0; outline: none; }

@media screen and (max-width: 640px) {

    .swiper-btn .swiper-button-next,
    .swiper-btn .swiper-button-prev { width: 32px; height: 32px; }
}

.swiper-btn .swiper-button-next:hover,
.swiper-btn .swiper-button-prev:hover { background-color: var(--color-sub-hex); }

.swiper-btn .swiper-button-prev::after { font-family: iconfont; content: "\e671"; color: #fff; font-size: 1rem; }
.swiper-btn .swiper-button-next::after { font-family: iconfont; content: "\e66f"; color: #fff; font-size: 1rem; }





.i-more { padding: 3.75rem 0 3.75rem; text-align: center; }
    .i-more a { height: 1.2rem; line-height: 1.2rem; padding-left: 1.2rem; padding-right: 1.2rem; display: inline-block; border-radius: 0.15rem; text-transform: uppercase; color: #fff; background: var(--color-hex); text-align: center; color: #FFFFFF; transition: all .36s ease; border: 1px solid var(--color-hex); }
        .i-more a:hover { border: 1px solid #666; background: none; background-color: #222; color: #fff; }
.i-more2 { text-align: center; margin-bottom: 3.75rem; }
    .i-more2 a { line-height: 1.1rem; height: 1.1rem; padding-left: 1.25rem; padding-right: 1.6rem; position: relative; border-radius: 0.675rem; background: var(--color-hex); color: white; text-transform: capitalize; display: inline-block; text-align: center; font-size: 1.25rem; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; transition: .5s; }
        .i-more2 a i { width: 2rem; height: 2rem; line-height: 2rem; border-radius: 100%; color: var(--color-hex); font-size: 1rem; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: 10px; background: white; text-align: center; -webkit-transition: .5s; -moz-transition: .5s; -ms-transition: .5s; -o-transition: .5s; transition: .5s; }
        .i-more2 a:hover i { -webkit-animation: td .5s linear; -o-animation: td .5s linear; -ms-animation: td .5s linear; -moz-animation: td .5s linear; animation: td .5s linear; }
        .i-more2 a.dataText { overflow: hidden; }


.home-more { background: var(--color-hex); color: #fff; border: 1px solid var(--color-hex); flex-shrink: 0; }
    .home-more:hover { background: #fff; color: var(--color-hex) !important; }












.i-pagination { bottom: 0px; z-index: 1; text-align: center; margin: 5px 0; }
    .i-pagination .swiper-pagination-bullet { width: 10px; height: 10px; margin: 0 5px !important; background-color: #3b373a; opacity: 1; position: relative; }
    .i-pagination .swiper-pagination-bullet-active { background-color: var(--color-hex); width: 30px; border-radius: 12px; }

/*h2.i-title { font-size: 0.9rem; line-height: 1.1rem; font-weight: 600; text-align: center; padding-bottom: 1.25rem; padding-top: 1rem; position: relative; }
    h2.i-title::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); height: 5px; width: 1rem; background: var(--color-hex); border-radius: 4px; }*/
.i-title { width: 100%; padding-bottom: 0.75rem; background: url(../img/line.png) no-repeat bottom; margin: 1.25rem 0; }
    .i-title h2 { font-size: 0.9rem; line-height: 0.9rem; text-align: center; font-weight: bold; }
    .i-title p { font-size: 1.25rem; line-height: 1.5rem; text-align: center; margin-top: 10px; }

.tit01 { text-align: center; color: #333333; font-weight: bold; margin: 0 0 3.125rem 0; }
    .tit01 a { color: #333333; }
    .tit01 p { font-weight: normal; display: block; color: #333333; }



.i-tit { }
    .i-tit h1, .i-tit h2 { position: relative; padding-bottom: 10px; }
    .i-tit i { font-style: normal; }
    .i-tit h2::after { height: 8px; width: 60px; content: ""; background: linear-gradient(90deg, var(--color-hex) 25%, var(--color-sub-hex) 100%); position: absolute; bottom: 0; left: 0 }
    .i-tit p { line-height: 2; }